<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Title</title>
    <meta content="" charset="UTF-8">
    <script language="JavaScript" src="script/vue.js"></script>
    <script type="" language="JavaScript">
        window.onload = function () {
            var vue = new Vue({
                // # 表示id
                // . 表示class
                "el": "#div0",
                "data": {
                    fruitList: [
                        {fname: "苹果", price: 6, fcount: 30, remark: "青苹果乐园"},
                        {fname: "香梨", price: 7, fcount: 20, remark: "库尔勒香梨"},
                        {fname: "菠萝", price: 8, fcount: 10, remark: "海南大菠萝"},
                        {fname: "荔枝", price: 9, fcount: 40, remark: "深圳妃子笑"}
                    ]
                }
            });
        }
    </script>
</head>
<body>
<div id="div0">
    <table border="1" width="400" cellpadding="4" cellspacing="0">
        <tr>
            <th>名称</th>
            <th>单价</th>
            <th>库存</th>
            <th>备注</th>
        </tr>
        <tr align="center" v-for="fruit in fruitList">
            <td> {{fruit.fname}}</td>
            <td> {{fruit.price}}</td>
            <td> {{fruit.fcount}}</td>
            <td> {{fruit.remark}}</td>
        </tr>
    </table>
</div>
</body>
</html>